<template>
  <div class="message-list-cont">
    <div
      class="mess-wrapper"
      v-for="(item, index) in messageEvalListSli"
      :key="index"
    >
      <div class="mess-left">
        <div :class="item.isread == 0 ? 'bg blue' : 'bg grey'"></div>
        <div class="info" @click="goToDetail(item, index)">
          <!-- 根据类型判断 -->
          <!-- 请前往<span class="choose" @click="goToDetail(item,index)">{{'工作池'}}</span> -->
          <div class="mess-eval-flex">
            <div class="mr10">
              <Avatar :src="item.photoUrl" />
              <!-- <Avatar>item.commentname</Avatar> -->
            </div>
            <div>
              <div>
                <span>{{ item.commentname }}</span
                >对您的{{ item.constate
                }}<span class="choose">{{ item.contno }}</span
                >给出了评价
              </div>
              <div class="grey-font">
                评价等级： <Rate v-model="item.level" disabled />
              </div>
              <div class="grey-font">评价内容： {{ item.comment }}</div>
            </div>
          </div>
        </div>
      </div>
      <div class="mess-right">{{ item.commentname }}</div>
    </div>
    <div class="message-page">
      <Page
        v-show="messageEvalList.length > 0"
        @on-change="changePage"
        :current="currentPage"
        :total="total"
        :page-size="pageSize"
      />
    </div>
    <div class="tc" v-show="messageEvalList.length == 0">暂无通知</div>
  </div>
</template>
<script>
export default {
  name: "messEval",
  props: ["messageEvalList"],
  data() {
    return {
      messageEvalListSli: [],
      currentPage: 1,
      pageSize: 10,
      total: 1,
      // current: "messageSys",
      // messageSys: 1,
      // messageMeet: 0,
      // messageEdu: 5,
      // messageCheck: 0,
      // messageEval: 0,
      // messageKnow: 0,
    };
  },
  methods: {
    goToDetail(item, index) {
      let obj = {
        type: 5,
        idList: item.id,
      };
      this.api.updateWorkDiaryReadNotice(obj).then((res) => {
        console.log(res);
        this.$store.commit("messageHasChangedFreshedQuickly", "eval" + item.id);
        // if (item.constate == "关爱件") {
        //   this.$router.push({
        //     name: "careServiceDetail",
        //     query: {
        //       row: item,
        //     },
        //   });
        // } else {
          this.$router.push({
            path: "/U/businessManagement/serviceDetail",
            query: {
              row: item,
            },
          });
        // }
        //先置为已读，再跳转
      });
      //   //先置为已读，再跳转
      // this.$router.push({
      //     name:'workLogging'
      // })
    },
    changePage(num) {
      this.currentPage = num;
      this.messageEvalListSli = this.messageEvalList.slice(
        (this.currentPage - 1) * this.pageSize,
        this.currentPage * this.pageSize
      );
    },
  },
  watch: {
    messageEvalList() {
      console.log("0meetwatch", this.messageEvalList);

      this.total = this.messageEvalList ? this.messageEvalList.length : 0;
      this.messageEvalListSli = this.messageEvalList
        ? this.messageEvalList.slice(
            (this.currentPage - 1) * this.pageSize,
            this.currentPage * this.pageSize
          )
        : [];
      console.log(this.total, "112233");
    },
  },
  mounted() {
    //重置current
    this.currentPage = 1;
    this.total = this.messageEvalList ? this.messageEvalList.length : 0;
    console.log(this.total, "222333");
    this.messageEvalListSli = this.messageEvalList
      ? this.messageEvalList.slice(
          (this.currentPage - 1) * this.pageSize,
          this.currentPage * this.pageSize
        )
      : [];
  },
};
</script>
<style lang="less">
@import "../index.less";
</style>